<template>
  <div class="sign">
      <div class="sign_top">
        <go-back></go-back>
          <div class="jifen">
              <p class="p1">您的可用积分为</p>
              <p class="p2">0</p>
          </div>
      </div>
      <div class="ddd">

      </div>
      <div class="qd">
          <button class="btn">签到</button>
      </div>
      <div class="goShop">
       
        <div class="goS">
          <div class="left">
             <img src="../../assets/imgs/goShop.png" alt="">
          </div>
              <div class="right">
                <p>消费购物</p>
                <p>积分兑好礼，20积分即可兑换礼券</p>
              </div>
              <div class="an">
                  <p class="p4">去购物</p>
              </div>
        </div>
      </div>
       <div class="goShop" style="margin-top:.6rem;">
       
        <div class="goS" style="background-color:#EDE6D6">
          <div class="left">
             <img src="../../assets/imgs/1.png" alt="">
          </div>
              <div class="right">
                <p>积分兑换</p>
                <p>积分兑好礼，20积分即可兑换礼券</p>
              </div>
              <div class="an">
                  <p class="p4">去兑换</p>
              </div>
        </div>
      </div>
 </div>
</template>

<script>
import goBack from '@/components/goBack/goBack'
export default {
  name: '',
  data() { 
    return {
      
    }
  },
  components:{goBack},
  created() {
  },
  mounted() {
  },
  methods:{
   
  },
  }
</script>

<style lang='scss' scoped>
.sign_top{
  width: 100%;
  height: 4rem;
  background-image: linear-gradient(to right ,#F4EDDD,#FCF8ED);
  
  .jifen{
    font-size: .3rem;
    padding-top: 1rem;
    text-align: center;
    .p1{
      color: #AEAEAB;
    }
    .p2{
      font-size: .5rem;
      padding-top: .3rem;
      font-weight: 700;
      color: #B3A078;
    }
  }
}
.ddd{
  width: 100%;
  height: 1.4rem;
  background-color: #E8E1CF;
}
.qd{
  width: 100%;
  height: 2rem;
  background-color: #fff;
  text-align: center;
  line-height: 1.4rem;
  .btn{
    background-color: #B3A078;
    color: #ffff;
    outline: none;
    width:3.6rem;
    height: 0.8rem;
    border-radius: .4rem;
    border: 0;
  }
}
.goShop{
  width: 100%;
  height: 1.6rem;
  .goS{
    font-size: .3rem;
    width: 90%;
    height: 1.6rem;
    margin: 0 auto;
    background-color: #F4EBE2;
    display: flex;
    .left{
     width: 1.4rem;
    img{
      width: 100%;
      height: 100%;
    }

    }
    .right{
      p{
        margin-top: .4rem;
        margin-left: .2rem;
        color: #E1B68C;
        font-size: .24rem;
      }
    }
    .an{
      height: 100%;
      margin: .6rem auto 0;
       .p4{
      width: 1.2rem;
      text-align: center;
      height: 0.5rem;
      line-height: .5rem;
      background-color: #E1B68C;
      color: #fff;
      border-radius: .2rem;
    }
    }
   
  }
}
</style>